<div class="text-center bg-primary container-fluid">
    <br>
    <h1><?php echo INSTALL_STEP3_TITLE;?></h1>
    <h3><?php echo INSTALL_STEP3_SUBTITLE;?></h3>
    <h5><?php echo INSTALL_STEP3_DESCRIPTION;?></h5>
    <br>
</div>
<div align="center">
    <h3><?php echo INSTALL_STEP3_CHOOSE_MAIL;?></h3>
    <div class="btn-group" data-toggle="buttons">
        <label class="btn btn-primary active">
            <input type="radio" name="option" id="defaultMail" checked><?php echo INSTALL_STEP3_CHOOSE_MAIL_DEFAULT;?>
        </label>
        <label class="btn btn-primary">
            <input type="radio" name="option" id="customMail"><?php echo INSTALL_STEP3_CHOOSE_MAIL_CUSTOM;?>
        </label>
    </div>
    <br><br>
    <div id="inputDIV" style="display: none">
        <div class="input-control has-icon-left" style="width: 75%">
            <input id="inputSMTP" type="text" class="form-control"
                   placeholder="<?php echo INSTALL_STEP3_INPUT_1_HINT;?>">
            <label for="inputSMTP" class="input-control-icon-left"><i class="icon-server text-primary"></i></label>
        </div>
        <br>
        <div class="input-control has-icon-left" style="width: 75%">
            <input id="inputUser" type="text" class="form-control"
                   placeholder="<?php echo INSTALL_STEP3_INPUT_2_HINT;?>">
            <label for="inputUser" class="input-control-icon-left"><i class="icon-user text-primary"></i></label>
        </div>
        <br>
        <div class="input-control has-icon-left" style="width: 75%">
            <input id="inputPass" type="text" class="form-control"
                   placeholder="<?php echo INSTALL_STEP3_INPUT_3_HINT;?>">
            <label for="inputPass" class="input-control-icon-left"><i class="icon-key text-primary"></i></label>
        </div>
        <br>
    </div>
    <div class="input-control has-icon-left" style="width: 75%;">
        <input id="inputMail" type="email" class="form-control" placeholder="<?php echo INSTALL_STEP3_INPUT_4_HINT;?>">
        <label for="inputMail" class="input-control-icon-left"><i class="icon-envelope text-primary"></i></label>
    </div>
    <br>
</div>
<div class="text-center bg-primary container-fluid">
    <br>
    <div align="center">
        <button class="btn btn-primary btn-lg" id="back"><?php echo INSTALL_BUTTON_BACK;?></button>
        <button class="btn btn-primary btn-lg" id="next"><?php echo INSTALL_BUTTON_NEXT;?></button>
    </div>
    <br>
</div>
<script>
    $(document).ready(function () {
        $("#next").click(function () {
            testMail();
        });
        $("#back").click(function () {
            self.location.href = "./?/install&step=2";
        });
        $("#defaultMail").change(function () {
            $("#inputDIV").fadeOut();
        });
        $("#customMail").change(function () {
            $("#inputDIV").fadeIn();
        });
    });

    function testMail() {
        new $.zui.Messager("<?php echo INSTALL_STEP3_MAIL_RUNNING;?>",{
            type:"info"
        }).show();
        var type = document.getElementById("customMail").checked ? "custom" : "default";
        var smtp = document.getElementById("inputSMTP").value;
        var user = document.getElementById("inputUser").value;
        var pass = document.getElementById("inputPass").value;
        var mail = document.getElementById("inputMail").value;
        $.post("./?/install", {
            command: "testMail",
            type: type,
            smtp: smtp,
            user: user,
            pass: pass,
            mail: mail
        }, function (data) {
            var list = JSON.parse(data);
            if (list.status==="successful"){
                new $.zui.Messager("<?php echo INSTALL_STEP3_MAIL_SUCCESSFUL;?>",{
                    type:"success",
                    time:0,
                    close:false,
                    actions:[{
                        name:'continue',
                        icon:'ok-sign',
                        text:'<?php echo INSTALL_STEP3_MAIL_CONTINUE;?>',
                        action:function () {
                            $.post("./?/install",{
                                command:"saveMail",
                                type:type,
                                smtp:smtp,
                                user:user,
                                pass:pass
                            },function (data) {
                                var list = JSON.parse(data);
                                if (list.status==="finish"){
                                    self.window.location="./?/install&step=4";
                                }
                            })
                        }
                    }]
                }).show();
            }else if (list.status==="fail"){
                new $.zui.Messager("<?php echo INSTALL_STEP3_MAIL_FAIL;?>",{
                    type:'danger'
                }).show();
                console.log(list.reason);
            }
        });
    }
</script>